/**
 * Copyright (c) 快宝网络 kuaidihelp.com Co., Ltd. All Rights Reserved 禁止外泄以及用于其它的商业用途
 */

import React from 'react';
import { Form, Modal, Row, Col } from 'antd';
import PropTypes from 'prop-types';
import ServiceFeeTable from './ServiceFeeTable';
import styles from './modal.less';

const FormItem = Form.Item;

@Form.create({ name: 'feeModal' })
class ChangeFeeModal extends React.PureComponent {
  limitDecimals = value => {
    const reg = /^(\-)*(\d+)\.(\d\d).*$/;
    if (typeof value === 'string') {
      return !isNaN(Number(value)) ? value.replace(reg, '$1$2.$3') : '';
    }
    if (typeof value === 'number') {
      return !isNaN(value) ? String(value).replace(reg, '$1$2.$3') : '';
    }
    return '';
  };

  renderForm = ({ feeSettings = [] }) => {
    const {
      form: { getFieldDecorator },
    } = this.props;
    return (
      <Form layout="inline">
        <FormItem className={styles.editTable} style={{ marginBottom: 24 }}>
          {getFieldDecorator('fee', {
            initialValue: feeSettings,
          })(<ServiceFeeTable />)}
        </FormItem>
      </Form>
    );
  };

  render() {
    const { visible, onCancel, onCreate, title, confirmLoading, record = {} } = this.props;
    return (
      <Modal
        title={title}
        visible={visible}
        onOk={onCreate}
        onCancel={onCancel}
        confirmLoading={confirmLoading}
        centered
        destroyOnClose
      >
        <div style={{ maxHeight: '600px', overflowX: 'scroll' }}>{this.renderForm(record)}</div>
      </Modal>
    );
  }
}

ChangeFeeModal.propTypes = {
  visible: PropTypes.bool,
  title: PropTypes.string,
  onOk: PropTypes.func,
  onCancel: PropTypes.func,
  wrappedComponentRef: PropTypes.func,
  frozenFee: PropTypes.any,
  type: PropTypes.string,
  confirmLoading: PropTypes.bool,
};

export default ChangeFeeModal;
